<script setup>
import { computed } from "vue";

// 接受参数
const props=defineProps({
  item: {
    type: Object
  }
})

// 定义一个计算属性参数
const getNodeRole = computed(()=>{
  console.log("labels:", props.item.metadata.labels)
  // 获取labels所有的key
  const  keyList= Object.keys(props.item.metadata.labels)
  if (keyList.length === 0) {
    return "中作节点"
  }
  // node-role.kubernetes.io/control-plane
  // node-role.kubernetes.io/controlplane
  // node-role.kubernetes.io/master
  if (keyList.includes('node-role.kubernetes.io/control-plane') ||keyList.includes('node-role.kubernetes.io/controlplane') || keyList.includes('node-role.kubernetes.io/master') ) {
    return "控制节点"
  }
  return "中作节点"
})
</script>

<template>
  <div>
    <el-descriptions
        size="large"
        :column="3"
        border>
        <el-descriptions-item  label="主机名">
          <span>{{ props.item.metadata.name }}</span>
        </el-descriptions-item>
        <el-descriptions-item  label="IP">
          <span>{{ props.item.status.addresses[0].address }}</span>
        </el-descriptions-item>
        <el-descriptions-item  label="角色">
          <el-tag type="primary" size="large">{{ getNodeRole }}</el-tag>
        </el-descriptions-item>
        <!--  节点状态 第二行数据  -->
        <el-descriptions-item  label="节点状态">
          <el-tag size="large"
                  :type="props.item.status.conditions[props.item.status.conditions.length-1].status?'success':'danger'"
          >
            {{ props.item.status.conditions[props.item.status.conditions.length -1].reason }}
          </el-tag>
        </el-descriptions-item>
        <el-descriptions-item  label="POD">
            <el-button   link type="primary">查看</el-button>
        </el-descriptions-item>
        <el-descriptions-item  label="操作系统">
            {{ props.item.status.nodeInfo.osImage }}
        </el-descriptions-item>
        <el-descriptions-item  label="Runtime">
          {{ props.item.status.nodeInfo.containerRuntimeVersion }}
        </el-descriptions-item>
        <el-descriptions-item  label="CPU架构">
          {{ props.item.status.nodeInfo.architecture }}
        </el-descriptions-item>
        <el-descriptions-item  label="组件版本">
          <span>
            kubelet-{{ props.item.status.nodeInfo.kubeletVersion }},
          </span>
          <span style="margin-left: 10px">
           kube-proxy-{{ props.item.status.nodeInfo.kubeProxyVersion }}
          </span>
        </el-descriptions-item>
        <el-descriptions-item  label="系统内核">
          {{ props.item.status.nodeInfo.kernelVersion }}
        </el-descriptions-item>
    </el-descriptions>
  </div>
</template>

<style scoped>

</style>